<template>
    <div style="width: 100%; height: 100vh;" >
        <mu-appbar style="width: 100%; height: 7vh;" color="primary">
            <mu-button icon slot="left" @click="back">
                <mu-icon value="arrow_back" ></mu-icon>
            </mu-button>
            工资结算
        </mu-appbar>
        <mu-container style="width: 100%; height: 93vh;" >
            <mu-row gutter>
                <mu-col span="18">
                    <mu-date-input  icon="today" v-model="startTime" label="开始日期" container="dialog" label-float full-width></mu-date-input>
                </mu-col>
                <mu-col span="18">
                    <mu-date-input  icon="today" v-model="endTime" label="结束日期" container="dialog" label-float full-width></mu-date-input>
                </mu-col>
            </mu-row>
            <mu-list>
                <mu-sub-header>店铺情况</mu-sub-header>
                <mu-list-item avatar button :ripple="false">
                    <mu-list-item-title>总销售额</mu-list-item-title>
                    <mu-list-item-action>￥{{money.paidPrice}}</mu-list-item-action>
                </mu-list-item>
                <mu-list-item avatar button :ripple="false">
                    <mu-list-item-title>总邮费</mu-list-item-title>
                    <mu-list-item-action>￥{{money.postPrice}}</mu-list-item-action>
                </mu-list-item>
                <mu-list-item avatar button :ripple="false">
                    <mu-list-item-title>总成本</mu-list-item-title>
                    <mu-list-item-action>￥{{money.costPrice}}</mu-list-item-action>
                </mu-list-item>
                <mu-sub-header>成员工资</mu-sub-header>
                <mu-list-item avatar button :ripple="false">
                    <mu-list-item-title>朱光萍</mu-list-item-title>
                    <mu-list-item-action>￥{{money.zgpWages}}</mu-list-item-action>
                </mu-list-item>
                <mu-list-item avatar button :ripple="false">
                    <mu-list-item-title>沙俊</mu-list-item-title>
                    <mu-list-item-action>￥{{money.sjunWages}}</mu-list-item-action>
                </mu-list-item>
                <mu-list-item avatar button :ripple="false">
                    <mu-list-item-title>沙杰</mu-list-item-title>
                    <mu-list-item-action>￥{{money.sjieWages}}</mu-list-item-action>
                </mu-list-item>
            </mu-list>
             <mu-button full-width color="primary" @click.native="calculate">结 算</mu-button>


        </mu-container>
    </div>

</template>

<script>
    import {Toast, MessageBox} from 'mint-ui';
    export default {
        name: "calculateWages",
        data(){
            return {
                startTime:new Date(new Date().setDate(new Date().getDate()-30)),
                endTime:new Date() ,
                money:{
                    costPrice: "-",
                    paidPrice:"-",
                    postPrice:"-",
                    sjieWages:"-",
                    sjunWages:"-",
                    zgpWages: "-",
                }
            }
        },
        methods:{
            calculate(){
                var formData=new FormData();
                formData.append('startTime',this.startTime.Format("yyyy/MM/dd"));
                formData.append('endTime',this.endTime.Format("yyyy/MM/dd"));
                this.$http.post(this.$Api.storeManage.calculateWages,formData).then(function ({data: resp} = res) {
                    if (resp.code == this.$ResponseCode.ok) {
                        this.money=resp.info.data;
                    }else{
                        window.failedNotify(Toast, resp.info.msg)
                    }
                }.bind(this))
            },
            // 返回
            back() {
                this.$router.go(-1)
            }
        }
    }
</script>

<style scoped>

</style>
